<template>
	<view>
		<!-- #ifdef APP-PLUS -->
		<view class="status_bar">  
		    <view class="top_view"></view>  
		</view>  
		<!-- #endif -->
		
		
		<view class="box">
			<image :src="loginbanner" class="sign-banner" alt=""></image>
			<image :src="loginlogo" class="sign-logo" alt=""></image>
			<view class="sign-box">
				<h3 style="height: 80rpx;">账号登录</h3>
				
				<view class="same-btn account">
					<label class="iconfont iconfonts icon-ym-people"></label>
					<input type="text" id="account" v-model="sign.account" placeholder="请输入帐号" />
				</view>
				<view class="same-btn password">
					<label class="iconfont iconfonts icon-ym-thecode"></label>
					<input type="text" id="password" v-model="sign.password" placeholder="请输入密码" :password="lookpwd?true:false" />
					<view class="iconfont eyes" :class="lookpwd?'icon-ym-hiding':'icon-ym-see'" @click="showHide"></view>
				</view>
				<view class="sign-btn" :load="load" @click="defaultLogin" hover-class="com-hover-btn">
					{{ load ? "登录中...":"登录"}}
				</view>
							
			</view>
			
			<view class="copyright">	
				<text class="txt">Copyright@2025-03-28 出品</text>
			</view>
			<view class="version">
				<text class="txt">Ver:1.0.6</text>
			</view>
			
		</view>
		
	</view>
</template>

<script>
	import config from '@/common/js/config.js'
	import system  from "@/common/js/menu.js"
	import graceChecker from '@/common/js/graceChecker.js'
	import helper from '@/common/js/helper.js'
	var rule = [{
		name: "account",
		checkType: "notnull",
		checkRule: "",
		errorMsg: "请输入账户"
	}, ]
	export default {
		data() {
			return {
				
				userlist:[
					 {
					  id:"1001", 
					  name:"秦始皇",
					  roleid:"101",
					  leader:"上海闵行区研学平台"
					 },{
					  id:"2001", 
					  name:"上海研学教育中心",
					  roleid:"102",
					  leader:"宋太祖"
					 },{
					  id:"3001", 
					  name:"上海博物馆",
					  roleid:"103",
					  leader:"朱元璋"
					 },{
					  id:"4001", 
					  name:"闵行春申小学",
					  roleid:"104",
					  leader:"孔子"
					 },{
					  id:"5001", 
					  name:"老师",
					  roleid:"105",
					  leader:"诸葛亮"
					 },
					 {
					  id:"6001", 
					  name:"一年级1班",
					  roleid:"106",
					  leader:"刘阿斗"
					 },
					 {
					  id:"7001", 
					  name:"家长",
					  roleid:"107",
					  leader:"刘备"
					 },
					],
				
				lookpwd: true,
				load: false,
				sign: {
					account: "",
					password: ""
				},
				loginbanner: require('../../../static/image/loginbanner.png'),//config.Resources.banner.loginbanner,
				loginlogo: require('../../../static/image/jnpf72.png'),//config.Resources.banner.loginlogo,
				Active: 'api',
				isUp: false,
				isShowAccount:true/* 是否显示账号开关 */
			}
		},
		created() {
			console.log(this.$store.state)
		},
		methods: { 
			defaultLogin() {
				var checkRes = graceChecker.check(this.sign, rule);		
				if (!graceChecker.check(this.sign, rule)) {
					helper.msg(graceChecker.error);
					return;
				}
					
				let accinfo = this.userlist.find(userlist => userlist.id == this.sign.account);
				if(accinfo==undefined){
					uni.showToast({
						title: '请输入正确的用户名',
						duration: 2000
					});
					return
				}
				//console.log(accinfo);
				
				var user=system.menulist;
				//let product = user.find(product => product.user == this.sign.account);
				let product = user.find(product => product.user == '1001');
				
				
				//https://blog.csdn.net/m0_65776770/article/details/146115263
				uni.setStorageSync('userid',this.sign.account);
				
				//this.$store.state.user=product;
				uni.setStorage({
					key: 'user_data',
					data: accinfo,
					success: function () {
						console.log('success');
					}
				});
				
				uni.switchTab({
					url: product.home
				});
			},
			showHide: function() {
				this.lookpwd = !this.lookpwd;
			},
		}
	}
</script>

<style lang="scss">
	/* #ifndef APP-PLUS */
	.status_bar {
	    height: var(--status-bar-height);  
	    width: 100%;  
	    background-color: #3281ff;  
	}  
	.top_view {  
	    height: var(--status-bar-height);  
	    width: 100%;  
	    position: fixed;  
	    background-color: #3281ff;  
	    top: 0;  
	    z-index: 999;  
	}
	/* #endif */
	
	
	#password {
		background: inherit;
		border: none;
		outline: none;
		width: inherit;
	}

	#account {
		background: inherit
	}

	.tabs {
		height: 80upx;
		margin: 30upx 0 60upx;
		display: flex;
		justify-content: space-around;
		align-items: center;
		position: relative;

		&::after {
			position: absolute;
			left: 0;
			width: 50%;
			height: 2rpx;
			content: '';
			display: block;
			bottom: 0;
			background-color: #3281ff;
			z-index: 100;
			transition: .5s;
		}

		&.active1 {
			&::after {
				left: 0;
			}
		}

		&.active2 {
			&::after {
				left: 50%;
			}
		}

		.tab {
			width: 50%;
			height: 80upx;
			text-align: center;
			color: #AEAFB5;
			font-size: 32upx;
			border-bottom: 1upx solid #AEAFB5;

			&.active {
				color: #3281ff;
				// border-bottom: 1upx solid #3281ff;
			}
		}
	}
	.box{
		position: relative;
		
	}
	.copyright{
		color: #AEAFB5;
		width: 100%;
		position: absolute;
		bottom: 20px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		padding-bottom: 20rpx;
	}
	.version{
		color: #AEAFB5;
		width: 100%;
		position: absolute;
		bottom: 0px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		padding-bottom: 20rpx;
	}
</style>
